<h4>{{i18n "discourse_subscriptions.admin.products.title"}}</h4>

<form class="form-horizontal">
  <p>
    <label for="name">
      {{i18n "discourse_subscriptions.admin.products.product.name"}}
    </label>
    <Input @type="text" name="name" @value={{this.model.product.name}} />
  </p>

  <p>
    <label for="description">
      {{i18n "discourse_subscriptions.admin.products.product.description"}}
    </label>

    <Textarea
      name="description"
      @value={{this.model.product.metadata.description}}
      class="discourse-subscriptions-admin-textarea"
    />

    <div class="control-instructions">
      {{i18n "discourse_subscriptions.admin.products.product.description_help"}}
    </div>
  </p>

  <p>
    <label for="statement_descriptor">
      {{i18n
        "discourse_subscriptions.admin.products.product.statement_descriptor"
      }}
    </label>

    <Input
      @type="text"
      name="statement_descriptor"
      @value={{this.model.product.statement_descriptor}}
    />

    <div class="control-instructions">
      {{i18n
        "discourse_subscriptions.admin.products.product.statement_descriptor_help"
      }}
    </div>
  </p>

  <p>
    <label for="repurchaseable">
      {{i18n "discourse_subscriptions.admin.products.product.repurchaseable"}}
    </label>

    <Input
      @type="checkbox"
      name="repurchaseable"
      @checked={{this.model.product.metadata.repurchaseable}}
    />

    <div class="control-instructions">
      {{i18n "discourse_subscriptions.admin.products.product.repurchase_help"}}
    </div>
  </p>

  <p>
    <label for="active">
      {{i18n "discourse_subscriptions.admin.products.product.active"}}
    </label>

    <Input
      @type="checkbox"
      name="active"
      @checked={{this.model.product.active}}
    />

    <div class="control-instructions">
      {{i18n "discourse_subscriptions.admin.products.product.active_help"}}
    </div>
  </p>
</form>

{{#unless this.model.product.isNew}}
  <h4>{{i18n "discourse_subscriptions.admin.plans.title"}}</h4>

  <p>
    <table class="table discourse-patrons-table">
      <thead>
        <th>{{i18n "discourse_subscriptions.admin.plans.plan.nickname"}}</th>
        <th>{{i18n "discourse_subscriptions.admin.plans.plan.interval"}}</th>
        <th>{{i18n "discourse_subscriptions.admin.plans.plan.created_at"}}</th>
        <th>{{i18n "discourse_subscriptions.admin.plans.plan.group"}}</th>
        <th>{{i18n "discourse_subscriptions.admin.plans.plan.active"}}</th>
        <th class="td-right">
          {{i18n "discourse_subscriptions.admin.plans.plan.amount"}}
        </th>
        <th class="td-right">
          <LinkTo
            @route="adminPlugins.discourse-subscriptions.products.show.plans.show"
            @models={{array this.model.product.id "new"}}
            class="btn"
          >
            {{i18n "discourse_subscriptions.admin.plans.operations.add"}}
          </LinkTo>
        </th>
      </thead>

      <tbody>
        {{#each this.model.plans as |plan|}}
          <tr>
            <td>{{plan.nickname}}</td>
            <td>{{plan.recurring.interval}}</td>
            <td>{{format-unix-date plan.created}}</td>
            <td>{{plan.metadata.group_name}}</td>
            <td>{{plan.active}}</td>
            <td class="td-right">
              {{format-currency plan.currency plan.amountDollars}}
            </td>
            <td class="td-right">
              <LinkTo
                @route="adminPlugins.discourse-subscriptions.products.show.plans.show"
                @models={{array this.model.product.id plan.id}}
                class="btn no-text btn-icon"
              >
                {{d-icon "far-pen-to-square"}}
              </LinkTo>
            </td>
          </tr>
        {{else}}
          <tr>
            <td colspan="8">
              <hr />
              {{i18n
                "discourse_subscriptions.admin.products.product.plan_help"
              }}
            </td>
          </tr>
        {{/each}}
      </tbody>
    </table>
  </p>
{{/unless}}

<div class="pull-right">
  <DButton @label="cancel" @action={{action "cancelProduct"}} @icon="xmark" />

  {{#if this.model.product.isNew}}
    <DButton
      @label="discourse_subscriptions.admin.products.operations.create"
      @action={{action "createProduct"}}
      @icon="plus"
      class="btn btn-primary"
    />
  {{else}}
    <DButton
      @label="discourse_subscriptions.admin.products.operations.update"
      @action={{action "updateProduct"}}
      @icon="check"
      class="btn btn-primary"
    />
  {{/if}}
</div>

{{outlet}}